<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>抽象出base</title>
	<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
    <script>
      var Class=(function(){

       var _mix=function(r,s){
           for(var p in s){
           	  if(s.hasOwnProperty(p)){
           	  	r[p]=s[p];
           	  }
           }
       }
       var _extend=function(){
          this.initPrototype=true;
          var prototype=new this();
          this.initPrototype=false;
          var items=Array.prototype.slice.call(arguments)||[];
          var item;
          while(item=items.shift()){
          	 _mix(prototype,item.prototype||item);
          }
          function SubClass(){
          	if(!SubClass.initPrototype&&this.init){
          		this.init.apply(this,arguments);
          	}
          }
          SubClass.prototype=prototype;
          SubClass.prototype.constructor=SubClass;
          SubClass.extend=_extend;
          return SubClass;
       }
      


      	var Class=function(){}
      	Class.extend=_extend;
      	return Class;

      })();

      var Base=Class.extend({
      	 init:function(config){
      	 	this._config=config;
      	 	this.bind();
      	 	this.render();
      	 },
      	 get:function(key){
      	 	return this._config[key];
      	 },
      	 set:function(key,value){
      	 	this._config[key]=value;
      	 },
      	 bind:function(){},
      	 render:function(){},
      	 destroy:function(){}
      });

      var TextCount=Base.extend({
      	_getNum:function(){
      		return this.get('input').val().length;
      	},
      	bind:function(){
      		var self=this;
      		self.get('input').on("keyup",function(){
      			self.render();
      		});
      	},
      	render:function(){
      		var num=this._getNum();
      		if($('#J_input_count').length==0){
      			this.get('input').after('<span id="J_input_count"></span>');
      		};
      		$("#J_input_count").html(num+"个字");
      	}
      });

      $(function(){
      	  new TextCount({
      	  	  input:$("#J_input")
      	  });
      });
    </script>
	<input type="text" id="J_input"/>
</body>
</html>